<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>员工列表</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<link rel="stylesheet" href="easyui/themes/default/easyui.css"
	type="text/css"></link>
	<link rel="stylesheet" href="easyui/themes/icon.css" type="text/css"></link>
	<script type="text/javascript" src="easyui/jquery.min.js"></script>
	<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript">
		$(function() {
			$('#dg').datagrid({    
		    url:'findPageAll_Emp.action',
		    width:828,    
		    singleSelect:true,
		    pagination:true,
		    pageList:[5,10,15,20],
		    pageSize:5,
		    
		    columns:[[    
		        {field:'eid',title:'编号',width:100,align:'center'},    
		        {field:'dep',title:'部门',width:100,align:'center',
		        	formatter: function(value,row,index) {
		        			return row.dep.depname;
		        		}
		        },
		        {field:'ename',title:'姓名',width:100,align:'center'},    
		        {field:'sex',title:'性别',width:100,align:'center'},
		        {field:'address',title:'地址',width:100,align:'center'},
		        {field:'birthday',title:'生日',width:100,align:'center'},
		        {field:'photo',title:'头像',width:100,align:'center',formatter:imgFormatter},
		        {field:'opt',title:'操作',align:'center',
		        		formatter: function(value,row,index) {
		        			return '<button id="button" name="button" value="删除" onclick="doDel('+row.eid+')">删除</button><button id="button" name="button" value="更新" onclick="findById('+row.eid+')">更新</button>';
		        		}
		        },    
		    ]]    
			}); 
		});	
	//删除员工
	function doDel(eid) {
		if(window.confirm("确定要删除？")) {
			window.location.href='delById_Emp.action?id='+eid;
		}
		return;
		
	}	
	//更新员工
	function findById(eid) {
		window.location.href='findById_Emp.action?id='+eid;
	}
	
	//图片添加路径  
    function imgFormatter(value,row,index){  
         if('' != value && null != value){  
        var strs = new Array(); //定义一数组   
        if(value.substr(value.length-1,1)==","){  
            value=value.substr(0,value.length-1)  
        }  
            strs = value.split(","); //字符分割   
      var rvalue ="";            
        for (i=0;i<strs.length ;i++ ){   
            rvalue += "<img onclick=download(\""+strs[i]+"\") style='width:66px; height:60px;margin-left:3px;' src='<%=path%>/uppic/" + strs[i] + "' title='点击查看图片'/>";  
            }   
        return  rvalue;        
         }  
        }  
		//这里需要自己定义一个div   来创建一个easyui的弹窗展示图片  
    function download(img){  
        var simg =  "<%=path%>/uppic/"+ img;  
        $('#dlg').dialog({  
            title: '预览',  
            width: 205,  
            height: 245,  
            resizable:true,  
            closed: false,  
            cache: false,  
            modal: true  
        });  
       $("#simg").attr("src",simg);  
         
    }   
    
	</script>
  </head>
  
  <body>
    <p align="center">员工列表</p>
    <hr/>
    <div align="center">
	    <table id="dg">
	    	
	    </table>
    </div>
    <div id="dlg"><img id="simg" style='width: 180px; height: 200px;'/></div>
    
    <hr/>
  </body>
</html>
